﻿<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>中软国际办公自动化管理系统</title>
    <link href="${pageContext.request.contextPath}/css/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        // 使用EL表达式初始化JavaScript变量
        var i = parseInt('${not empty claimVoucher.detailList ? claimVoucher.detailList.size() : 0}');
        var rowNumber = parseInt('${not empty claimVoucher.detailList ? claimVoucher.detailList.size() : 0}');
        var totalAccount = '${claimVoucher.total_account}' || 0;

        $(function(){
            // 表单提交校验
            $("form[name='claimForm']").submit(function(){
                // 判断是否加入了明细
                if($("#rowNumber").val() < 1){
                    $("#notice").text("* 添加报销单的明细，至少一条 ！");
                    return false;
                }
                $("#notice").text("*");

                // 校验每个明细项
                for(var s = 0; s < $("#rowNumber").val(); s++){
                    if(isEmpty($("#account"+s).val())){
                        $("#notice").text("* 金额不能为空 ！");
                        return false;
                    }
                    if(isEmpty($("#des"+s).val())){  // 改为 des
                        $("#notice").text("* 说明不能为空 ！");
                        return false;
                    }
                }
                $(".buttons").hide();
                return true;
            });

            // 添加明细行
            $("#AddRow").click(function(){
                var item = $("#item").val();
                var account = $("#account").val();
                var des = $("#des").val();  // 改为 des

                if(!item || !account || !des) {
                    $("#notice").text("* 请填写完整的明细信息！");
                    return;
                }

                var tr = $("#myTable tr").eq(0).clone();
                ++i;
                var j = i - 1;
                totalAccount = parseFloat(totalAccount) + parseFloat(account);

                tr.find("td").eq(0).html("<input name='detailList["+j+"].item' id='item"+j+"' type='hidden' value='"+item+"' />"+item);
                tr.find("td").eq(1).html("<input name='detailList["+j+"].account' id='account"+j+"' type='hidden' value='"+account+"' />"+account);
                tr.find("td").eq(2).html("<input name='detailList["+j+"].des' id='des"+j+"' type='hidden' value='"+des+"' />"+des);  // 改为 des
                tr.find("td").eq(3).html("<img src='${pageContext.request.contextPath}/images/delete.gif' width='16' height='16' id='DelRow"+j+"' onclick='delRow("+j+")' />");
                tr.show();
                tr.appendTo("#myTable");

                // 更新行数和总金额
                rowNumber = i;
                $("#rowNumber").val(rowNumber);
                $("#account").val("");
                $("#des").val("");  // 改为 des
                $("#total_account").val(totalAccount);  // 改为 total_account
                $("#notice").text("*");
            });
        });

        // 删除行
        function delRow(id){
            var account = $("#account"+id).val();
            $("#myTable tr").eq(id+1).remove();

            // 重新排序
            for(var s = id + 1; s < rowNumber; s++){
                $("#item"+s).attr("name", "detailList["+(s-1)+"].item");
                $("#item"+s).attr("id", "item"+(s-1));
                $("#account"+s).attr("name", "detailList["+(s-1)+"].account");
                $("#account"+s).attr("id", "account"+(s-1));
                $("#des"+s).attr("name", "detailList["+(s-1)+"].des");  // 改为 des
                $("#des"+s).attr("id", "des"+(s-1));  // 改为 des

                $("#DelRow"+s).attr("onclick", "delRow("+(s-1)+")");
                $("#DelRow"+s).attr("id", "DelRow"+(s-1));
            }

            $("#rowNumber").val(rowNumber - 1);
            --i;
            --rowNumber;
            totalAccount = parseFloat(totalAccount) - parseFloat(account);
            $("#total_account").val(totalAccount);  // 改为 total_account
        }

        // 辅助函数：检查是否为空
        function isEmpty(str){
            return str == null || str.trim() == "";
        }

        // 提交报销单
        function submitClaimVoucher(action){
            if(!confirm("确定" + action + "报销单吗？")) return;

            if (action == '保存') {
                document.claimForm.status.value = "新创建";
            } else {
                document.claimForm.status.value = "已提交";
            }
            document.claimForm.submit();
        }
    </script>
</head>
<body>
<div class="action divaction">
    <div class="t">报销单更新</div>
    <div class="pages">
        <form action="${pageContext.request.contextPath}/claimVoucher_updateClaimVoucher_action" name="claimForm" method="post">
            <input type="hidden" id="rowNumber" name="rowNumber" value="${not empty claimVoucher.detailList ? claimVoucher.detailList.size() : 0}"/>

            <!-- 修改1: 去掉claimVoucher.前缀，改为name="id" -->
            <input type="hidden" id="claimId" name="id" value="${claimVoucher.id}"/>

            <table width="90%" border="0" cellspacing="0" cellpadding="0" class="addform-base">
                <caption>基本信息</caption>
                <tr>
                    <td>编&nbsp;&nbsp;号：${claimVoucher.id}</td>
                    <td>填&nbsp;写&nbsp;人：${claimVoucher.createEmployeeName}</td>
                    <td>部&nbsp;&nbsp;门：${claimVoucher.departmentName}</td>
                    <td>职&nbsp;&nbsp;&nbsp;&nbsp;位：${claimVoucher.positionName}</td>
                </tr>
                <tr>
                    <td>总金额：
                        <!-- 修改2: 去掉claimVoucher.前缀，改为name="total_account" -->
                        <input type="text" name="total_account" id="total_account" readonly value="${claimVoucher.total_account}"/></td>
                    <td>填报时间：${claimVoucher.create_time}</td>
                    <td>状态：${claimVoucher.status}</td>
                    <td>待处理人：${claimVoucher.nextDealEmployeeName}</td>
                    <!-- 修改3: 去掉claimVoucher.前缀，改为name="status" -->
                    <input type="hidden" id="status" name="status" value="${claimVoucher.status}"/>
                </tr>
                <tr>
                    <td colspan="4"><p>-------------------------------------------------------------------------------</p></td>
                </tr>
            </table>

            <!-- 明细表格 -->
            <table id="myTable" width="90%" border="0" cellspacing="0" cellpadding="0" class="addform-base">
                <tr>
                    <td width="30%">项目类别</td>
                    <td width="30%">项目金额</td>
                    <td width="30%">费用说明</td>
                    <td width="10%">操作</td>
                </tr>
                <c:forEach items="${claimVoucher.detailList}" var="claimDetail" varStatus="s">
                    <tr>
                        <td>
                            <input type="hidden" name="detailList[${s.index}].id" value="${claimDetail.id}"/>
                            <input type="hidden" name="detailList[${s.index}].item" id="item${s.index}" value="${claimDetail.item}"/>
                                ${claimDetail.item}
                        </td>
                        <td>
                            <input type="hidden" name="detailList[${s.index}].account" id="account${s.index}" value="${claimDetail.account}"/>
                                ${claimDetail.account}
                        </td>
                        <td>
                            <input type="hidden" name="detailList[${s.index}].des" id="des${s.index}" value="${claimDetail.des}"/>  <!-- 改为 des -->
                                ${claimDetail.des}  <!-- 改为 des -->
                        </td>
                        <td>
                            <img src="${pageContext.request.contextPath}/images/delete.gif" width="16" height="16" id="DelRow${s.index}" onclick="delRow(${s.index})"/>
                        </td>
                    </tr>
                </c:forEach>
            </table>

            <!-- 添加新明细的表单 -->
            <table id="detailTable" width="90%" border="0" cellspacing="0" cellpadding="0" class="addform-base">
                <tr>
                    <td width="30%">
                        <!-- 修改4: 去掉claimVoucherDetail.前缀，改为name="item" -->
                        <select name="item" id="item">
                            <option value="城际交通费">城际交通费</option>
                            <option value="市内交通费">市内交通费</option>
                            <option value="通讯费">通讯费</option>
                            <option value="礼品费">礼品费</option>
                            <option value="办公费">办公费</option>
                            <option value="交际餐费">交际餐费</option>
                            <option value="餐补">餐补</option>
                            <option value="住宿费">住宿费</option>
                        </select>
                    </td>
                    <td width="30%">
                        <!-- 修改5: 去掉claimVoucherDetail.前缀，改为name="account" -->
                        <input type="text" name="account" id="account" />
                        <span class="notice">*</span>
                    </td>
                    <td width="30%">
                        <!-- 修改6: 去掉claimVoucherDetail.前缀，改为name="des" -->
                        <input type="text" name="des" id="des" />
                        <span class="notice">*</span>
                    </td>
                    <td width="10%">
                        <img src="${pageContext.request.contextPath}/images/add.gif" width="16" height="16" id="AddRow"/>
                    </td>
                </tr>
            </table>

            <!-- 事由和按钮 -->
            <table width="90%" border="0" cellspacing="0" cellpadding="0" class="addform-base">
                <tr>
                    <td width="15%">*事由：</td>
                    <td width="85%">
                        <!-- 修改7: 去掉claimVoucher.前缀，改为name="event" -->
                        <textarea name="event" id="event" rows="5" cols="66">${claimVoucher.event}</textarea>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" style="text-align:center;padding:20px;">
                        <div class="buttons">
                            <input type="button" value="保存" onclick="submitClaimVoucher('保存')" class="submit_01"/>
                            <input type="button" value="提交" onclick="submitClaimVoucher('提交')" class="submit_01"/>
                            <input type="button" value="返回" onclick="window.history.go(-1)" class="submit_01"/>
                            <span id="notice" style="color:red;margin-left:10px;">*</span>
                        </div>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>
</body>
</html>